<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<h1 id="count">0</h1>
		<button type="button" id="btn">停止</button>
		<button type="button" id="btn2">延时调用</button>
	</body>
</html>
<script type="text/javascript">
	var count = document.getElementById("count");
	// 使count中的内容自动切换
	// setInterval()定时调用将一个函数每隔一段时间执行一次，参数：回调函数，每次调用间隔时间ms
	// setInterval返回number类型数据,作为定时器的唯一标识
	var num = 1;
	var timer = setInterval(function(){
			count.innerHTML = num++;
			if(num == 20)
				clearInterval(1)
	},1000)
	console.log(timer)
	// clearInterval()可以关闭定时器
	// clearInterval(1)
	var btn = document.getElementById("btn")
	btn.onclick = function(){
		clearInterval(1)
	}
	var btn2 = document.getElementById("btn2")
	btn2.onclick = function(){
		// setTimeout()延时调用,只执行一次
		setTimeout(function(){
			count.innerHTML = num++;
		},1000)
	}
</script>
